<template>
    <section class="modlude">
      <el-form :inline="true" :model="formSearch" class="form_inline" label-width="90px">
        <!-- <el-form-item label="所属组织" size="small">
              <el-cascader
                  ref="cascader"
                  v-model="option1"
                  :options="dataTree"
                  :props="defaultProps2"
                  @change="handleChange"
                  clearable
                >
                </el-cascader>
            </el-form-item> -->
        <el-form-item label="所属项目" size="small">
          <el-select v-model="formSearch.projectId" placeholder="请选择项目">
            <el-option v-for="(item,index) in xqTree" :label="item.name" :value="item.id" :key="index"></el-option>
          </el-select>
        </el-form-item>
        <!-- <el-form-item label="部门" size="small">
            <el-select v-model="formSearch.status" placeholder="请选择部门">
              <el-option label="全部" :value="''"></el-option>
              <el-option label="物业" :value="1"></el-option>
            </el-select>
          </el-form-item> -->
        <!-- <el-form-item label="选择部门" size="small" prop="department">
            <el-cascader
                ref="cascader1"
                v-model="option2"
                :options="dataTree"
                :props="defaultProps2"
                @change="handleChange1"
              >
              </el-cascader>
          </el-form-item> -->
        <el-form-item label="姓名" size="small">
          <el-input v-model="formSearch.name" placeholder="请输入姓名"></el-input>
        </el-form-item>
        <el-form-item label="手机号" size="small">
          <el-input v-model="formSearch.phone" placeholder="请输入手机号"></el-input>
        </el-form-item>
        <el-form-item>
          <!-- v-if="$root.btnControl.find(item=>item=='view')" -->
          <el-button size="small"  @click="getlist">查 询</el-button>
        </el-form-item>
        <!-- <el-form-item>
            <el-button size="small" @click="">重 置</el-button>
          </el-form-item> -->
        <el-form-item>
          <!--  v-if="$root.btnControl.find(item=>item=='add')" -->
          <el-button size="small" @click="addDialog = true"><i
              class="el-icon-plus"></i> 新 增</el-button>
        </el-form-item>
        <!-- <el-form-item>
            <el-button size="small" @click="">导 出</el-button>
          </el-form-item> -->
      </el-form>
      <el-table :data="formData" style="width: 100%">
  
        <el-table-column prop="projectName" label="所属项目"></el-table-column>
        <el-table-column prop="name" label="姓名"></el-table-column>
        <el-table-column prop="phone" label="手机号码"></el-table-column>
        <el-table-column prop="department" label="部门"></el-table-column>
        <el-table-column prop="sex" label="性别">
          <template slot-scope="scope">
            {{scope.row.sex==0?'男':"女"}}
          </template>
        </el-table-column>
        <el-table-column label="操作" fixed="right" width=310>
          <template slot-scope="scope">
            <!-- v-if="$root.btnControl.find(item=>item=='edit')" -->
            <el-button type="" size="small"  @click="xiugai(scope.row,2)">
              修 改</el-button>
              <!-- v-if="$root.btnControl.find(item=>item=='delete')" -->
            <el-button type="" size="small" 
              @click="daleteInfo(scope.row.id)">删 除</el-button>
              <!-- v-if="$root.btnControl.find(item=>item=='view')" -->
            <el-button type="" size="small"  @click="xiugai(scope.row,3)">
              详 情</el-button>
          </template>
        </el-table-column>
      </el-table>
      <paging @changePage=handleCurrentPage :get-total='total'></paging>
  
      <!-- 新增 -->
      <el-dialog :title="Addoredit==1?'新增':Addoredit==2?'修改':'详情'" :visible.sync="addDialog" @close="canceladd"
        :close-on-click-modal="false">
        <div class="cont_box_right">
          <el-form label-position="right" :rules="rules" label-width="100px" :model="formPush" ref='ywrylist'>
  
            <el-form-item label="选择项目" size="small" prop="projectId">
              <el-select @change="" v-model="formPush.projectId" placeholder="请选择项目">
                <el-option v-for="(item,index) in xqTree" :label="item.name" :value="item.id" :key="index"></el-option>
              </el-select>
            </el-form-item>
            <el-form-item label="姓名" prop="name" size="small">
              <el-input v-model="formPush.name" disabled placeholder="请输入姓名"></el-input>
              <el-button style="margin-top: 1px;" class="button-new-tag" size="small" @click="gettyyygList"><i
                  class="el-icon-plus"></i> 选择已有员工</el-button>
            </el-form-item>
            <el-form-item label="手机号码" size="small" prop="phone">
              <el-input v-model="formPush.phone" placeholder="请输入手机号码"></el-input>
            </el-form-item>
            <el-form-item label="性别" size="small" prop="sex">
              <el-select v-model="formPush.sex" placeholder="请选择性别">
                <el-option label="男" :value="0"></el-option>
                <el-option label="女" :value="1"></el-option>
              </el-select>
            </el-form-item>
            <!-- <el-form-item label="部门" size="small" prop="department" >
                <el-input  v-model="formPush.department" disabled placeholder="请输入部门"></el-input>
              </el-form-item> -->
            <el-form-item label="部门" size="small" prop="department">
              <el-select v-model="formPush.department" placeholder="请选择部门">
                <el-option v-for="(item,index) in bumendata" :label="item.name" :value="item.name" :key="index">
                </el-option>
              </el-select>
            </el-form-item>
            <el-form-item label="公司" size="small" prop="company">
              <el-input v-model="formPush.company" placeholder="请输入公司"></el-input>
            </el-form-item>
            <el-form-item label="地址" size="small" prop="address">
              <el-input v-model="formPush.address" placeholder="请输入地址"></el-input>
            </el-form-item>
            <el-form-item label="证件类型" size="small" prop="idNumberType">
              <el-select v-model="formPush.idNumberType" placeholder="请选择证件类型">
                <el-option label="身份证" :value="0"></el-option>
                <el-option label="港澳通行证" :value="1"></el-option>
                <el-option label="护照" :value="2"></el-option>
                <el-option label="其它" :value="3"></el-option>
              </el-select>
            </el-form-item>
            <el-form-item label="证件号码" size="small" prop="identity">
              <el-input v-model="formPush.identity" placeholder="请输入证件号码"></el-input>
            </el-form-item>
            <el-form-item label="年龄" size="small" prop="age">
              <el-input v-model="formPush.age" placeholder="请输入年龄"></el-input>
            </el-form-item>
            <el-form-item label="备注" size="small" prop="remark">
              <el-input v-model="formPush.remark" placeholder="请输入备注"></el-input>
            </el-form-item>
  
          </el-form>
        </div>
        <div class="dialog-footer" style="text-align: center;">
          <el-button size="medium " v-if="Addoredit == 3" @click="canceladd">关 闭</el-button>
          <el-button size="medium " v-else @click="addList">提 交</el-button>
        </div>
      </el-dialog>
  
      <!-- 选择人员 -->
      <el-dialog width="50%" title="选择人员" :visible.sync="xcryDialog" @close="closeey" :close-on-click-modal="false">
        <el-form :inline="true" :model="formSearch1" class="form_inline">
          <el-form-item label="所属组织" size="small">
            <el-cascader ref="cascader" v-model="option1" :options="dataTree" :props="defaultProps2"
              @change="handleChange" clearable>
            </el-cascader>
          </el-form-item>
  
          <el-form-item label="账号" size="small">
            <el-input v-model="formSearch1.account" placeholder="请输入账号"></el-input>
          </el-form-item>
          <el-form-item label="姓名" size="small">
            <el-input v-model="formSearch1.name" placeholder="请输入姓名"></el-input>
          </el-form-item>
          <el-form-item label="手机号" size="small">
            <el-input v-model="formSearch1.mobile" placeholder="请输入手机号"></el-input>
          </el-form-item>
          <el-form-item>
            <el-button size="small"  @click="gettyyygList">查 询</el-button>
            <!-- <el-button size="medium " @click="addDialog = true,imageUrl = '',isAddUpdata=1" v-if="$root.btnControl.find(item=>item=='add')">新 增</el-button> -->
          </el-form-item>
        </el-form>
        <el-table :data="formData1" style="width: 100%" stripe>
          <el-table-column width="25">
            <template slot-scope="scope">
              <el-radio @change='changeRadiorow(scope.row)'
                v-model="formPush.managerId" :label="scope.row.id" style="color:transparent;"></el-radio>
            </template>
          </el-table-column>
          <el-table-column prop="account" label="账号"></el-table-column>
          <el-table-column prop="name" label="姓名"></el-table-column>
          <!-- <el-table-column prop="avatar" label="头像" width="100">
                          <template slot-scope="scope">
                    <el-image style="width: 70px; height: 70px" :src="scope.row.avatar" fit="cover"></el-image>
                          </template>
                </el-table-column> -->
          <el-table-column prop="orgName" label="所属组织"></el-table-column>
          <el-table-column prop="mobile" label="号码"></el-table-column>
          <el-table-column label="性别">
            <template slot-scope="scope">
              {{scope.row.sex==2?"女":scope.row.sex==1?"男":'未知'}}
            </template>
          </el-table-column>
          <el-table-column prop="position" label="职位"></el-table-column>
          <el-table-column label="状态">
            <template slot-scope="scope">
              {{scope.row.status==1?"启用":'禁用'}}
            </template>
          </el-table-column>
        </el-table>
          <paging1 @changePage=handleCurrentPage3 :get-total='total3'></paging1>
        
        <div slot="footer" class="dialog-footer">
          <el-button size="medium " @click="yuangongqd">确 定</el-button>
        </div>
  
      </el-dialog>
  
  
    </section>
  </template>
  
  <script>
    import paging from "../paging"
       import paging1 from "../paging"
    import { updInvestigators,deleteInvestigators, getInvestigatorsList, addInvestigators, userListPage, xqSelectList, orgTree } from '../../url/api';
    export default {
      data() {
        return {
          Addoredit: 1,
          option1: [],
          option2: [],
          xqTree: [],
          formSearch: {
            current: 1,
            size: 10,
            roleType: 2,//维保人员
          },
          formSearch1: {
            current: 1,
            size: 10,
            name:'',
            mobile:'',
            roles:'repair',
          },
          option1: [],
          defaultProps2: {
            children: 'children',
            label: 'name',
            value: 'id',
            expandTrigger: 'hover', checkStrictly: true
          },
          formData: [],//数据
          formData1: [],//数据
          xunchadianData: [],//巡查点数据
          total: 0,//数据总数
          total3: 0,//数据总数
          pages: 0,//页面总数
          dataTree: [],
          addDialog: false,//新增标识
          xcryDialog: false,//巡更点标识
          formPush: {//新增表单
            roleType: 2,//维保人员
            //department:"外包"
            name: '',
            phone: '',
            identity: '',
            sex: '',
            idNumberType: '',
            projectId: '',
            department: '',
            company: '',
            address: '',
            age: '',
            managerId:'',
          },
          bumendata: [
            { 'name': "外包" }
          ],
          yuangongdata: {
            managerId:''
          },
          formxungengdian: {
            current: 1,
            size: 5,
            type: 1
          },
          managerId: "",//员工id
          dynamicTags: [],//tag
          rules: {
            name: [{ required: true, message: '该项不能为空', trigger: 'change' }],
            phone: [{ required: true, message: '该项不能为空', trigger: 'change' }],
            identity: [{ required: true, message: '该项不能为空', trigger: 'change' }],
            sex: [{ required: true, message: '该项不能为空', trigger: 'change' }],
            idNumberType: [{ required: true, message: '该项不能为空', trigger: 'change' }],
            projectId: [{ required: true, message: '该项不能为空', trigger: 'change' }],
            // department: [{ required: true, message: '该项不能为空', trigger: 'change' }],
            // company: [{ required: true, message: '该项不能为空', trigger: 'change' }],
            // address: [{ required: true, message: '该项不能为空', trigger: 'change' }],
            // age: [{ required: true, message: '该项不能为空', trigger: 'change' }],
          },
        }
      },
      methods: {
        xiugai(row, index) {
          this.Addoredit = index
          //console.log(row);
          this.formPush.projectId = row.projectId *1
          this.formPush.name = row.name
          this.formPush.phone = row.phone
          this.formPush.sex = row.sex
          this.bumendata = [
            {
              'name': row.department
            }
          ];
          this.formPush.department = row.department
          this.formPush.company = row.company
          this.formPush.address = row.address
          this.formPush.idNumberType = row.idNumberType
          this.formPush.identity = row.identity
          this.formPush.age = row.age
          this.formPush.remark = row.remark
          this.yuangongdata.managerId = row.managerId
          this.formPush.managerId = row.managerId
          this.formPush.id = row.id
          this.addDialog = true
         
  
        },
        daleteInfo(id) {
  
          let params = [
            id
          ]
          this.$confirm("确定要删除吗？", '提示', {
            confirmButtonText: '确定',
            cancelButtonText: '取消',
            type: 'warning'
          }).then(() => {
            deleteInvestigators(params).then((res) => {
              ////console.log("删除", res)
              if (res.data.ok) {
                this.$message({
                  message: '删除成功',
                  type: 'success'
                });
                this.getInit()
              } else {
                this.$message('删除失败')
              }
            })
  
          }).catch(() => {
  
          });
  
        },
  
  
  
        gettyyygList() {//人员列表
          // if(this.Addoredit == 2){
          //   this.formSearch1.name = this.formPush.name
          //   this.formSearch1.mobile = this.formPush.phone
          // }
          userListPage(this.formSearch1).then((res) => {
            ////console.log(res)
            if (res.data.ok) {
              this.formData1 = res.data.data.records.filter((item) => {
                if (item.gmtCreate) {
                  item.gmtCreate = this.$root.getDateArray(item.gmtCreate)[9]
                }
                return item
              })
              this.total3 = res.data.data.total * 1
              // this.
              // if(this.Addoredit == 2){
              //     //console.log(this.formPush.managerId);
              // }
            } else {
              this.$message(res.data.message);
            }
            this.formSearch1.current= 1
          })
          this.xcryDialog = true;
        },
        changeRadiorow(row) {
          this.yuangongdata = row;
  
        },
        yuangongqd() {
          this.addDialog = false;
          this.xcryDialog = false;
          ////console.log("你好");
          ////console.log("this.yuangongdata", this.yuangongdata);
          let data = this.yuangongdata;
          ////console.log("data", data);
          let obj = JSON.parse(JSON.stringify(this.formPush))
          // this.managerId = data.id;
          if (data.sex == 1) {
            data.sex = 0;
          } else {
            data.sex = 1;
          };
          this.bumendata = [
            {
              'name': data.orgName
            }
          ];
          this.formPush = {
            roleType: 2,
            projectId: obj.projectId,
            address: data.address,
            age: data.age,
            company: data.companyName,
            identity: data.idNumber,
            name: data.name,
            phone: data.phone,
            department: data.orgName,
            sex: data.sex,
            idNumberType: data.idNumberType,
            managerId:data.id,
            id : obj.id
          }
          console.log(this.formPush,"aaaaaaaaaaaa");
          this.addDialog = true;
  
  
          ////console.log("AAAAAAAAAAA", this.formPush);
        },
        //新增
        addList(ywrylist) {
          //console.log("============", this.formPush)
          //let obj = JSON.parse(JSON.stringify(this.formPush))
          this.$refs.ywrylist.validate((valid) => {
            ////console.log("valid", valid)
            if (valid) {
              this.$confirm("确定执行此操作吗？", '提示', {
                confirmButtonText: '确定',
                cancelButtonText: '取消',
                type: 'warning'
              }).then(() => {
  
                //console.log(this.formPush)
                if (this.Addoredit == 1) {
                  delete this.formPush.id
                  addInvestigators(this.formPush).then((res) => {
                    ////console.log("新增", res)
                    if (res.data.ok) {
                      this.addDialog = false
                      this.$message({
                        message: '添加成功',
                        type: 'success'
                      });
                      this.getlist();
  
                    } else {
                      this.$message('添加失败');
                    }
                    this.addDialog = false;
                  })
                } else if (this.Addoredit == 2) {
                     
                  updInvestigators(this.formPush).then((res) => {
                    ////console.log("新增", res)
                    if (res.data.ok) {
                      this.addDialog = false
                      this.$message({
                        message: '修改成功',
                        type: 'success'
                      });
                      this.getlist();
  
                    } else {
                      this.$message('修改失败');
                    }
                    this.addDialog = false;
                  })
                  // //console.log(this.formPush);
                  //             this.$message('还没有修改接口！')
                  //             this.addDialog = false
                }
  
  
  
  
              })
  
            } else {
              ////console.log('error submit!!');
              return false;
            }
          });
  
        },
        handleChange1(value) {
          if (value.length != 0) {
            ////console.log(value)
            ////console.log(this.$refs.cascader1.getCheckedNodes()[0].data);
            if (this.$refs.cascader1.getCheckedNodes()[0].data.type != 1) {
              this.formSearch.department = this.$refs.cascader1.getCheckedNodes()[0].data.name
            } else {
              this.option2 = []
              this.formSearch.department = ''
              this.$message("只能选择部门")
            }
  
          } else {
            this.formPush.orgId = ''
          }
        },
        closeey() {
          this.xcryDialog = false;
          this.yuangongdata = {};
          //this.$refs.xclxlist.resetFields();
        },
  
  
        canceladd() {
  
          this.bumendata = [
            {
              'name': "外包"
            }
          ];
          this.formPush = {//表单
            roleType: 2,
            name: '',
            phone: '',
            identity: '',
            department: '',
            sex: '',
            idNumberType: '',
            projectId: '',
            department: '',
            company: '',
            address: '',
            age: '',
            managerId:'',
          }
          //console.log("hahahah");
          this.addDialog = false
          this.Addoredit = 1
          this.$refs.ywrylist.resetFields();
        },
        //表格翻页多选
        getRowKeys: function (row) {
          return row.id;
        },
        toggleSelection4(val) {
          ////console.log("xuanzhonsg", val);
          this.dynamicTags = [];
          for (var i = 0; i < val.length; i++) {
            this.dynamicTags.push(val[i]);//直接push表格数据对象，这样就可以方便将两个数据进行关联，如方法：handeleClose
          }
        },
        handleCurrentPage3(val) {//页码区域改变
          this.formSearch1.current = val
          this.gettyyygList()
        },
  
  
  
        getlist() {
          getInvestigatorsList(this.formSearch).then((res) => {//巡查人员列表
            ////console.log("巡查人员列表:", res)
            if (res.data.ok) {
              this.formData = res.data.data.records.filter((item) => {
                return item
              })
              this.total = res.data.data.total * 1
            } else {
              this.$message(res.data.message);
            }
          })
          let org_tree = {
            name: '',
            status: 1
          }
          orgTree(org_tree).then((res) => {//获取组织列表
            ////console.log(res)
            if (res.data.ok) {
              this.dataTree = res.data.data
            }
          })
        },
        handleChange(value) {
          if (value.length != 0) {
            ////console.log(value)
            this.formSearch1.orgId = this.$refs.cascader.getCheckedNodes()[0].data.id
          } else {
            this.formSearch1.orgId = ''
          }
        },
        getInit() {
          // this.getshiwuTypejieshu()
          this.getlist()
          // this.getworkOrderlist()
          xqSelectList({}).then((res) => {//项目选择列表
            ////console.log("QQQQQQQQQQQ",res)
            if (res.data.ok) {
              this.xqTree = res.data.data
            }
          })
        },
  
        handleCurrentPage(val) {//页码改变
          this.formSearch.current = val
          this.getlist()
        },
      },
      mounted() {
        this.getInit()
      },
      updated() {
        // //console.log(this.yuangongdata);
      },
      components: {
        paging,
        paging1
      }
    }
  </script>
  <style scoped>
  
  </style>